<template>
    <div>
        <typeNav/>
        <ListContainer/>
        <Recomment/>
        <Rank/>
        <Like/>
        <Floor v-for="floor in floorList" :key="floor.id" :list='floor'/>
        <Brank/>
    </div>
</template>

<script>
import ListContainer from './ListContainer'
import Recomment from './Recomment'
import Rank from './Rank'
import Like from './Like'
import Floor from './Floor'
import Brank from './Brank'
import {mapState} from 'vuex'

export default {
    name:'home',
    components:{ListContainer, Recomment, Floor, Rank, Like, Brank},
    computed: {
        ...mapState({
            floorList: (state) => state.home.floorList,
        }),
    },
    mounted() {
        this.$store.dispatch('home/getFloorList');
    }
}
</script>

<style lang="less" scoped>
button {
    margin: 10px;
}
</style>